
{extend name="index/index"}
{block name="centent"}
<!--中间内容-->
<div class="mainbox">
  <!--左侧图片部分-->
  <div class="leftpic">
    <ul>
      <li><img src="http://pn5tyoo5a.bkt.clouddn.com/{$picture.src}" height="600"/></li>
    </ul>
  </div>
  <!--右侧产品信息部分-->
  <div class="goods-rightbox">
    <!--商品基本信息区块-->
    <h2 class="goodsname">{$picture['title']}</h2>
    <div class="basic-info">
      <!--商品简介-->
      <p class="goods-brief">
          {empty name="$picture.icon"}
            <img src="/static/index/imgs/vip.jpg" width="30" height="30"/>
          {else /}
            <img src="http://pn5tyoo5a.bkt.clouddn.com/{$picture.icon}" width="50" height="50"/>
          {/empty}
            <br>
      </p>
      <!--商品简介区块结束-->
      <ul>
        <li> <em updatespec="updateprice">作者:{$picture['name']}</em> </li>
        <li>
          <span class="goumai" style="float:left">
            {empty name="follow"}
            <a href="javascript:void(0);" onclick="concern(this,'{$picture.user_id}')">
            关注
            </a>
            {else /}
            <a href="javascript:void(0);" onclick="concern(this,'{$picture.user_id}')" style="background: #90c31f;color:white">
            取消关注</a>
            {/empty}
          </span>&nbsp;&nbsp;&nbsp;
          <span class="goumai" style="float:left">
          {empty name="like"}
          <a href="javascript:void(0);" onclick="like(this,'{$picture.id}')">收藏</a>
          {else /}
          <a href="javascript:void(0);" onclick="like(this,'{$picture.id}')" style="background: #90c31f;color:white">已收藏</a>
          {/empty}
          </span>
        </li>
      </ul>
    </div>
    <div class="goodsinfo">
      <div class="title1">
        <h1>详细介绍</h1>
      </div>
      {empty name="$picture.icon"}
        <p>采用国际流行色系，专为花房餐厅打造的简约日式环境，像一息凉爽的风，浸润着南国温热的阳光。</p>
        <p>独有的新鲜花卉装饰，柔和了整个餐厅的线条，空气中的清新花香愉悦了整个感官。</p>
        <p>45dB的背景音乐，温和宜人。吻合着律动的脉搏，每一个音符都温暖动人。</p>
        <p>礼遇不一样的“温情设计</p>
        <p>花房故事厨师团队融合各菜系（粤，川，湘，徽，赣）之所长，采用最优质的食材研发各式菜品，餐厅着眼每个细节，虔心尊重食材并提炼其本真味道，把食物的味道发挥到极致，让每一口都成为享受。</p>
        <p>邂逅独一无二的”味臻美食“</p>
      {else /}
        <p>{$picture.abstruct}</p>
      {/empty}

      </p>
    </div>
  </div>
</div>
<!-- 评论 -->
  <div class="comment">
      {volist name="comment" id="v"}
      <div class="centent">

        <div class="comment-left">
          {empty name="$v.icon"}
          <img src="/static/index/imgs/vip.jpg" alt="" width="70" height="70">
          {else /}
          <img src="http://pn5tyoo5a.bkt.clouddn.com/{$v.icon}" alt="" width="70" height="70">
          {/empty}
          <div class="img-bttom">{$v['name']}</div>

        </div>
        <div class="comment-right">
          <div class="centent-top">评价:{$v['content']} <span style="float:right">{$v['commenttime']}</span></div>
          <div class="centent-bottom">作者回复:{$v['reply']}</div>
        </div>
      </div>
      {/volist}
  </div>
  <div>
  <div class="do-comment" style="margin-left: 165px;">
    <button class="btn1" id="showModel2">评论</button>
    <div id="modal2" class="modal">
      <div class="modal-content">
        <header class="modal-header">
          <h4 style="margin:0px auto;font-size: 25px">评论</h4>
          <span class="close2">×</span>
        </header>
        <div class="modal-body">
          <form id="form_comment" method="get">
            <table>
              <label for="" style="margin-top: 20px;">
                <td>评论内容:</td>
              </label>
              <label for="">
                <tr>
                  <td>
                    <input type="hidden" name="id" value="{$picture['id']}">
                    <input type="hidden" name="name" value="{$picture['name']}">
                    <textarea name="content" id="" cols="80" rows="10" style="margin-left: 50px"></textarea>
                  </td>
                </tr>
              </label>
            </table>
        </div>
          <footer class="modal-footer">
            <div id="cancel2" class="cancel">取消</div>
            <div id="cancel2" class="cancel" onclick="hmyComment()">提交</div>
          </footer>
          </form>
      </div>
    </div>
  </div>
</div>
      <script>
          var btn2 = document.getElementById('showModel2');
          var close2 = document.getElementsByClassName('close2')[0];
          var cancel2 = document.getElementById('cancel2');
          var modal2 = document.getElementById('modal2');

          btn2.addEventListener('click', function(){
              modal2.style.display = "block";
          });

          close2.addEventListener('click', function(){
              modal2.style.display = "none";
          });

          cancel2.addEventListener('click', function(){
              modal2.style.display = "none";
          });



          // 评论
            function hmyComment(){ 
              var data = $('#form_comment').serialize();
              // console.log(data);

                $.ajax({
                    url:'/comment',
                    Type:'get',
                    data:data,
                    dataType:'json',
                    success:function(data){

                      if (data.status) {

                          toastr.success(data.msg);
                          window.location.reload(); 

                      } else {

                          toastr.error(data.msg);
                          
                      }

                    },
                    error:function(data){

                        toastr.error('系统故障,请联系管理员');
                        
                    }
                });
 
            
            } 
      </script>
      
  <script>
    // 加入关注
    function concern(obj,uid){


                $.ajax({
                    url:'/concern',
                    Type:'get',
                    data:{uid:uid},
                    dataType:'json',
                    success:function(data){

                      if (data.status) {

                          toastr.success(data.msg);
                          window.location.reload(); 

                      } else {

                          toastr.error(data.msg);
                          
                      }

                    },
                    error:function(data){

                        toastr.error('系统故障,请联系管理员');
                        
                    }
                });
    }

    // 加入收藏
    function like(obj,id){
                // console.log(id);
                $.ajax({
                    url:'/like',
                    Type:'get',
                    data:{id:id},
                    dataType:'json',
                    success:function(data){

                      if (data.status) {

                          toastr.success(data.msg);
                          window.location.reload(); 

                      } else {

                          toastr.error(data.msg);
                          
                      }

                    },
                    error:function(data){

                        toastr.error('系统故障,请联系管理员');
                        
                    }
                });
    }
  </script>

<div class="clear"></div>
{/block}

